<template>

  <div style="padding: 10px;">
    <el-row >
      <el-col>
        <div style="display: flex;">
          <div>
            <el-form :model="list_params" ref="searchForm"  size="small" :inline="true">
              <el-form-item label="搜索" label-width="80px" prop="settlementNumber">
                <el-input v-model="list_params.settlementNumber" placeholder="结算单号/合同号/货柜号" ></el-input>
              </el-form-item>
              <el-form-item label="货主" prop="cargoOwnerId"  v-if="is_owner != 1" >
                <el-select filterable  v-model="list_params.cargoOwnerId" placeholder="请选择货主" clearable :style="{width: '100%'}">
                  <el-option v-for="item in owner_list" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="档口" prop="stallId"  >
                <el-select filterable  v-model="list_params.stallId" placeholder="请选择档口" clearable :style="{width: '100%'}">
                  <el-option v-for="item in stall_list" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="结算状态" prop="settlementStatus">
                <el-select filterable  v-model="list_params.settlementStatus" placeholder="请选择结算状态" clearable filterable :style="{width: '100%'}">
                  <el-option v-for="item in dict.type.order_settlement_status" :label="item.label" :value="item.value"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item>
                <el-button type="primary"  size="mini" @click="handleQuery">搜索</el-button>
                <el-button  size="mini" @click="resetQuery">重置</el-button>
              </el-form-item>
            </el-form>
          </div>
          <div style="flex: 1;"></div>
                    <div>
          <!--            <el-button>删除</el-button>-->
          <!--            <el-button @click="handleEnable(0)" >禁用</el-button>-->
          <!--            <el-button @click="handleEnable(1)" >启用</el-button>-->
          <!--            <el-button @click="handleExport">导出</el-button>-->
          <!--            <el-button>导入</el-button>-->
                      <el-button type="primary" @click="addInfo" v-has-permi="['xnf:settlement:add']" >新增</el-button>
                    </div>
        </div>
      </el-col>
      <el-col>
        <div style="margin-top: 10px;">
          <el-table :data="list_data" @selection-change="handleSelectionChange" :height="table_height" style="width: 100%;" >
            <el-table-column type="selection" width="50" align="center"  />
            <el-table-column label="货柜号" prop="containerNumber"></el-table-column>
            <el-table-column label="货主" prop="cargoOwnerName"></el-table-column>
            <el-table-column label="档口" prop="stallName"></el-table-column>
            <el-table-column label="结算日期" prop="settlementDate"></el-table-column>
            <el-table-column label="结算单号" prop="settlementNumber"></el-table-column>
<!--            <el-table-column label="代卖档口" prop="productName"></el-table-column>-->
            <el-table-column label="销售金额" prop="saleAmt"></el-table-column>
            <el-table-column label="商品结算金额" prop="goodsSettlementAmt"></el-table-column>
            <el-table-column label="垫付费用" prop="prepaymentFee"></el-table-column>
            <el-table-column label="调整金额" prop="adjustmentAmt"></el-table-column>
            <el-table-column label="结算金额" prop="settlementAmt"></el-table-column>
            <el-table-column label="结清状态" prop="settleUp">
              <template slot-scope="scope" >
                <div v-if="scope.row.settleUp==0">未结清</div>
                <div v-else >已结清</div>
                </template>
            </el-table-column>
            <el-table-column label="结算状态" prop="settlementStatus">
              <template slot-scope="scope" >
                <dict-tag :options="dict.type.order_settlement_status" :value="scope.row.settlementStatus"/>
              </template>
            </el-table-column>
            <el-table-column label="操作" prop="cargoOwnerName" fixed="right">
              <template slot-scope="scope" >
                <el-button
                  size="mini"
                  type="text"
                  @click="showInfo(scope.row)"
                >查看详情</el-button>
              </template>
            </el-table-column>
          </el-table>
          <pagination
            v-show="list_total>0"
            :total="list_total"
            :page.sync="list_params.pageNum"
            :limit.sync="list_params.pageSize"
            @pagination="getList"
          />
        </div>
      </el-col>
    </el-row>
    <el-drawer
      title="结算单详情"
      size="80%"
      :visible.sync="dialog_show">
      <div>
        <div class="section">
          <el-row>
            <el-col :span="4" class="section-item">
              <div class="section-item-title">结算日期</div>
              <div>{{info.settlementDate}}</div>
            </el-col>
            <el-col :span="4" class="section-item">
              <div class="section-item-title">结算单号</div>
              <div>{{ info.settlementNumber }}</div>
            </el-col>
            <el-col :span="4" class="section-item">
              <div class="section-item-title">状态</div>
              <div>
                <dict-tag :options="dict.type.order_settlement_status" :value="info.settlementStatus"/>
              </div>
            </el-col>
            <el-col :span="4" class="section-item">
              <div class="section-item-title">供货单</div>
              <div>{{ info.supplyList.containerNumber }}</div>
            </el-col>
            <el-col :span="4" class="section-item">
              <div class="section-item-title">货主</div>
              <div>{{ info.supplyList.cargoOwnerName }}</div>
            </el-col>
            <el-col :span="4" class="section-item">
              <div class="section-item-title">供货产品</div>
              <div>{{ info.supplyList.productNames }}</div>
            </el-col>
          </el-row>
        </div>
        <div class="section">
          <el-row>
            <el-col :span="4">
              <div style="display: flex;padding: 0px 10px;">
                <div style="flex:1;">
                  <div>待结算金额</div>
                  <div style="line-height: 36px;" >{{ info.settlementAmt }}</div>
                </div>
                <div>=</div>
              </div>
            </el-col>
            <el-col :span="4">
              <div style="display: flex;padding: 0px 10px;">
                <div style="flex:1;">
                  <div>商品结算金额</div>
                  <div style="line-height: 36px;" >{{ info.goodsSettlementAmt }}</div>
                </div>
                <div>-</div>
              </div>
            </el-col>
            <el-col :span="4">
              <div style="display: flex;padding: 0px 10px;">
                <div style="flex:1;">
                  <div>调整金额</div>
                  <div style="line-height: 36px;" v-if="!is_edit" >{{ info.adjustmentAmt }}</div>
                  <div v-else style="height: 36px;">
                    <el-input v-model="info.adjustmentAmt" placeholder="请输入调整金额" ></el-input>
                  </div>
                </div>
                <div>-</div>
              </div>
            </el-col>
            <el-col :span="4">
              <div style="display: flex;padding: 0px 10px;">
                <div style="flex:1;">
                  <div>代卖垫付费用</div>
                  <div style="line-height: 36px;" >{{ info.prepaymentFee }}</div>
                </div>
              </div>
            </el-col>
            <el-col :span="4" >
              <div>结清状态</div>
              <div style="line-height: 36px;" v-if="!is_edit">{{ info.settleUp == 1?'已结清':'未结清' }}</div>
              <div v-else>
                <el-select filterable  v-model="info.settleUp" placeholder="请选择结清状态" clearable filterable :style="{width: '100%'}">
                  <el-option label="已结清" :value="1"></el-option>
                  <el-option label="未结清" :value="0"></el-option>
                </el-select>
              </div>
            </el-col>
          </el-row>
        </div>
        <div class="section">
          <div style="padding-bottom: 12px;">产品明细</div>
          <div>
            <el-table :data="sale_products" show-summary :summary-method="getSellSummaries">
              <el-table-column label="序号">
                <template slot-scope="scope" >
                  {{ scope.$index + 1 }}
                </template>
              </el-table-column>
              <el-table-column label="产品" prop="productName">
              </el-table-column>
              <el-table-column label="规格" prop="specificationName"></el-table-column>
              <el-table-column label="到货数量" prop="agencySellingCnt"></el-table-column>
              <el-table-column label="箱规(KG/件)" prop="boxSpecificationWeight"></el-table-column>
              <el-table-column label="重量(KG)" prop="weight"></el-table-column>
              <el-table-column label="销售数量" prop="saleCnt"></el-table-column>
              <el-table-column label="销售均价" prop="unitPrice">
              </el-table-column>
              <el-table-column label="销售金额" prop="saleAmt"></el-table-column>
              <el-table-column label="剩余数量" prop="agencySellingSurplusCnt"></el-table-column>
            </el-table>
          </div>
        </div>
        <div class="section">
          <div style="padding-bottom: 12px;">待结算代卖垫付费用</div>
          <div>
            <el-table :data="sale_fees" show-summary  :summary-method="getSummaries">
              <el-table-column label="序号">
                <template slot-scope="scope" >
                  {{ scope.$index + 1 }}
                </template>
              </el-table-column>
              <el-table-column label="科目" prop="financeSubjectName">

              </el-table-column>
              <el-table-column label="金额" prop="amt"></el-table-column>
              <el-table-column label="备注" prop="remark"></el-table-column>
            </el-table>
          </div>
        </div>
        <div class="section" style="display: flex;justify-content: flex-end;position: sticky;bottom: 0px;">
          <el-button type="primary" @click="edit" v-if="info.settlementStatus == 4&&!is_edit">编辑</el-button>
          <el-button type="primary" @click="saveEdit" v-if="is_edit">保存</el-button>
          <el-button type="primary" @click="sign" v-if="info.settlementStatus == 4">确认签署</el-button>
          <el-button type="primary" @click="settlementOrder" v-if="info.settlementStatus < 3">去结算</el-button>
        </div>
      </div>
    </el-drawer>

    <el-drawer
      title="新增结算单"
      size="80%"
      :visible.sync="edit_dialog_show">
      <el-form ref="form" :model="formData" :rules="formDataRules" :inline="true">
      <div>
        <div class="section">
          <el-row>
            <el-col :span="6">
              <el-form-item label="代卖档口" prop="stallId">
                <el-select filterable  v-model="formData.stallId" @change="onStallChange" filterable>
                  <el-option v-for="item in stall_list" :label="item.name" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="代卖单" prop="agencySellingListId">
                <el-select filterable  v-model="formData.agencySellingListId" @change="onSellingIdChange" filterable>
                  <el-option v-for="item in selling_list" :label="item.containerNumber" :value="item.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6" >
              <el-form-item label="结算日期" prop="settlementDate">
                <el-date-picker v-model="formData.settlementDate"></el-date-picker>
              </el-form-item>
            </el-col>
<!--            <el-col :span="6">-->
<!--              <div class="section-item-title">状态</div>-->
<!--              <div>-->
<!--                <dict-tag :options="dict.type.order_settlement_status" :value="info.settlementStatus"/>-->
<!--              </div>-->
<!--            </el-col>-->
            <el-col>
              <div class="section-item-title">供货单信息</div>
              <div>
                <el-table :data="[supply_order_info]">
                  <el-table-column label="合同号" prop="contractNumber"></el-table-column>
                  <el-table-column label="货柜号" prop="containerNumber"></el-table-column>
                  <el-table-column label="货主" prop="cargoOwnerName"></el-table-column>
                  <el-table-column label="供货产品" prop="productNames"></el-table-column>
                  <el-table-column label="总数量" prop="totalQty"></el-table-column>
                </el-table>
              </div>
            </el-col>
          </el-row>
        </div>
        <div class="section">
          <el-row>
            <el-col :span="4">
              <div style="display: flex;padding: 0px 10px;">
                <div style="flex:1;">
                  <div>商品销售金额</div>
                  <div>{{getProductSum()}}</div>
                </div>
                <div style="height: 80px;width: 1px;background: #cccccc;"></div>
              </div>
            </el-col>
            <el-col :span="4">
              <div style="display: flex;padding: 0px 10px;">
                <div style="flex:1;">
                  <div>待结算金额</div>
                  <div>{{getWaitSettleAmt()}}</div>
                </div>
                <div>=</div>
              </div>
            </el-col>
            <el-col :span="4">
              <div style="display: flex;padding: 0px 10px;">
                <div style="flex:1;">
                  <div>商品结算金额</div>
                  <div>{{getProductSum()}}</div>
                </div>
                <div>-</div>
              </div>
            </el-col>
            <el-col :span="4">
              <div style="display: flex;padding: 0px 10px;">
                <div style="flex:1;">
                  <div>调整金额</div>
                  <div><el-form-item>
                    <el-input v-model="info.adjustmentAmt"></el-input>
                  </el-form-item></div>
                </div>
                <div>-</div>
              </div>
            </el-col>
            <el-col :span="4">
              <div style="display: flex;padding: 0px 10px;">
                <div style="flex:1;">
                  <div>代卖垫付费用</div>
                  <div>{{getPrepaymentFeeSum()}}</div>
                </div>
              </div>
            </el-col>
            <el-col>
              <el-form-item label="是否结清" prop="settleUp">
                <el-radio-group v-model="formData.settleUp">
                  <el-radio  label="0">未结清</el-radio>
                  <el-radio  label="1">已结清</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="备注" prop="remark">
                <el-input v-model="info.remark"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </div>
        <div class="section">
          <div style="padding-bottom: 12px;">产品明细</div>
          <div>
            <el-table :data="sale_products" show-summary :summary-method="getSellSummaries">
              <el-table-column label="序号">
                <template slot-scope="scope" >
                  {{ scope.$index + 1 }}
                </template>
              </el-table-column>
              <el-table-column label="产品" prop="productName">
              </el-table-column>
              <el-table-column label="规格" prop="specificationName"></el-table-column>
              <el-table-column label="到货数量" prop="agencySellingCnt"></el-table-column>
              <el-table-column label="箱规(KG/件)" prop="boxSpecificationWeight"></el-table-column>
              <el-table-column label="重量(KG)" prop="weight"></el-table-column>
              <el-table-column label="销售数量" prop="saleCnt"></el-table-column>
              <el-table-column label="销售均价" prop="unitPrice">
              </el-table-column>
              <el-table-column label="销售金额" prop="saleAmt"></el-table-column>
              <el-table-column label="剩余数量" prop="agencySellingSurplusCnt"></el-table-column>
            </el-table>
          </div>
        </div>
        <div class="section">
          <div style="padding-bottom: 12px;">待结算代卖垫付费用</div>
          <div>
            <el-table :data="sale_fees" show-summary :summary-method="getSummaries">
              <el-table-column label="序号">
                <template slot-scope="scope" >
                  {{ scope.$index + 1 }}
                </template>
              </el-table-column>
              <el-table-column label="科目" prop="financeSubjectId">
                  <template slot-scope="scope" >
                    <el-select filterable  v-model="sale_fees[scope.$index].financeSubjectId" filterable>
                      <el-option v-for="fee in fees" :key="fee.id" :label="fee.name" :value="fee.id" ></el-option>
                    </el-select>
                  </template>
              </el-table-column>
              <el-table-column label="金额" prop="amt">
                <template slot-scope="scope" >
                  <el-input type="number" v-model="sale_fees[scope.$index].amt"></el-input>
                </template>
              </el-table-column>
              <el-table-column label="备注" prop="remark">
                <template slot-scope="scope" >
                  <el-input type="number" v-model="sale_fees[scope.$index].remark"></el-input>
                </template>
              </el-table-column>
              <el-table-column label="操作" prop="op">
                <template slot-scope="scope" >
                  <el-button
                    size="mini"
                    type="text"
                    v-if="scope.$index != 0"
                    @click="delOtherFee(scope.$index)"
                  >删除</el-button>
                  <el-button
                    size="mini"
                    type="text"
                    @click="addOtherFee(scope.row)"
                  >新增</el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </div>
        <div class="section" style="display: flex;justify-content: flex-end;position: sticky;bottom: 0px;">
          <!--          <el-button type="primary" @click="submitData">确认签署</el-button>-->
          <el-button type="primary" @click="submitSettlement" v-if="settle_form.settlementStatus != 3">确定结算</el-button>
        </div>
      </div>
      </el-form>
    </el-drawer>


    <el-dialog title="代卖结算" :visible.sync="confirmSettleDialogVisible" center top="400px" width="700px" style="border-radius: 10px;" @close="close" >
            <el-form :model="settle_form" :rules="settle_form_rules" ref="settle_form">
              <el-row>
                <el-col :span="8">
                  <div style="display: flex;">
                    <div style="padding: 10px;flex: 1;">
                      <div>商品结算金额：</div>
                      <div style="margin-top: 10px;font-size: 18px;">{{ settle_form.goodsSettlementAmt }}</div>
                    </div>
                    <div style="padding: 10px;">-</div>
                  </div>
                </el-col>
                <el-col :span="8">
                  <div style="display: flex;">
                    <div style="padding: 10px;flex:1;">
                      <div>金额调整：</div>
                      <el-form-item style="margin-top: 10px;">
                        <el-input type="number" v-model="settle_form.adjustmentAmt"></el-input>
                      </el-form-item>
                    </div>
                    <div style="padding: 10px;">-</div>
                  </div>
                </el-col>
                <el-col :span="7">
                  <div style="padding: 10px;">
                    <div>垫付费用：</div>
                    <div style="margin-top: 10px;font-size: 18px;">{{settle_form.prepaymentFee}}</div>
                  </div>
                </el-col>
                <el-col :span="1">
                  <div style="padding: 10px;">=</div>
                </el-col>
                <el-col>
                  <el-form-item label="结算金额">
                    <div>{{ settle_form.goodsSettlementAmt - (settle_form.adjustmentAmt == undefined?0:settle_form.adjustmentAmt) -settle_form.prepaymentFee}}</div>
                  </el-form-item>
                </el-col>
                <el-col>
                  <el-form-item label="是否结清" prop="settleUp">
                    <el-radio-group v-model="settle_form.settleUp">
                      <el-radio label="0">未结清</el-radio>
                      <el-radio label="1" >已结清</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </el-col>
                <el-col>
                  <el-form-item label="结算日期" prop="settlementDate">
                    <el-date-picker type="date" placeholder="选择日期" v-model="settle_form.settlementDate"></el-date-picker>
                  </el-form-item>
                </el-col>
                <el-col>
                  <el-form-item prop="remark" label="备注">
                    <el-input v-model="settle_form.remark"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-form>
       <div slot="footer"  >
        <el-button @click="confirmSettleDialogVisible = false"  >取消</el-button>
        <el-button type="primary" @click="settleConfirm">确定结算</el-button>
      </div>
    </el-dialog>

  </div>
</template>

<script>

import {list as subjectList} from '@/api/base/subject'
import {getSaleProductList} from '@/api/sell/sale_list'
import { list, detail, add, settlement, signSettlement,setSettlementType } from '@/api/sell/settlement'
import {list as feeList} from '@/api/fee/fee'
import { list as supplyOrderList, detail as supplyOrderDetail } from '@/api/supply/order'
import {list as sellingList,getProductList,detail as sellingDetail,initiateSettlement } from '@/api/agency/selling'
import { list as stallList, detail as stallDetail } from '@/api/base/stall'
import { list as ownerList } from '@/api/base/owner'
import { mapGetters } from 'vuex'

export default {
  name: 'sea_transportation',
  computed: {
    ...mapGetters([
      'roles'
    ]),
  },
  dicts:['unit','currency','supply_list_status','manage_type','material_flow_type','order_settlement_status'],
  data() {
    return {
      table_height:window.innerHeight - 300,
      dialog_show : false,
      edit_dialog_show : false,
      list_data:[],
      list_total:0,
      formData:{},
      formDataRules:{
        stallId: [{ required: true, message: '请选择代卖档口', trigger: 'change' }],
        agencySellingListId: [{ required: true, message: '请选择代卖单', trigger: 'change' }],
        settlementDate: [{ required: true, message: '请选择结算日期', trigger: 'change' }],
        settleUp: [{ required: true, message: '请选择是否结清', trigger: 'change' }],
      },
      list_params:{
        settlementNumber: '',
        settlementStatus:'',
        pageNum: 1,
        pageSize: 10,
      },
      info:{
        adjustmentAmt:0,
        supplyList:{}
      },
      order_products:[],
      sale_products:[],
      sale_fees:[],
      data_fees:[{ sub_id:'' }],
      confirmSettleDialogVisible:false,
      settle_form:{
        adjustmentAmt:0,
        settleUp:'0'
      },
      settle_form_rules:{
        adjustmentAmt: [{ required: true, message: '请输入金额调整', trigger: 'blur' }],
        settleUp:[{required:true,message:'请选择结算状态',trigger:'change'}],
        settlementDate:[{required:true,message:'请选择结算日期',trigger:'change'}]
      },
      supply_order_list:[],
      stall_list:[],
      selling_list:[],
      supply_order_info:{},
      supplyListId:0,
      owner_list:[],
      is_edit:false,
      is_owner:0
    }
  },
  created() {
    this.getSubjectList()
    this.getList()
    this.getSupplyOrderList()
    this.getStallList()
    this.getOwnerList()

    this.is_owner = (this.roles.indexOf('cargo_owner') != -1)?1:0;
    if(this.is_owner != 1){
      this.getOwnerList()
    }
    console.log(this.roles)

  },
  methods: {
    getOwnerList(){
      ownerList({is_page:0}).then(res => {
        this.owner_list = res.rows;
      })
      },
    getSellingList(){
      let param = {stallId:this.formData.stallId,is_page:0,agencySellingStatus:11}
      sellingList(param).then(res => {
        this.selling_list = res.rows;
      })
    },
    getSupplyOrderList(){
      supplyOrderList({is_page:0}).then(res => {
        this.supply_order_list = res.rows;
      })
      },
    getStallList(){
      stallList({is_page:0}).then(res => {
        this.stall_list = res.rows;
        })
    },
    getFees(id){
      feeList({supplyListId:id,is_page:0}).then(res => {
        this.fees =  res.rows;
      })
    },
    getSaleProducts(id){
      let params = {agencySellingListId:id}
      getSaleProductList(params).then(res => {
        this.sale_products = res.rows;
        this.getFeeList()
      })
    },
    getOrderProductList(id){
      getProductList(id).then(res => {
        this.order_products = res.rows;
      })
    },
    getList(){
      list(this.list_params).then(res => {
        console.log(res)
        this.list_data = res.rows;
        this.list_total = res.total
      })
    },
    handleSelectionChange(){},
    getSubjectList(){
      subjectList({is_page:0}).then(res => {
        console.log(res)
        this.fees =  res.rows;
      })
    },
    handleQuery() {
      this.getList()
    },
    resetQuery(){
      this.list_params = {
        ...this.list_params,
        pageNum:1,
        cargoOwnerId:'',
        settlementNumber:'',
        settlementStatus:'',
        stallId:'',
      }
      this.getList()
    },
    showInfo({id}){
      this.is_edit = false;
      this.sale_products = []
      this.sale_fees = []
      detail(id).then(res => {
        this.info = res.data;
        this.sale_products = res.data.agentSettleResult.saleProductDetailList
        this.sale_fees = res.data.agentSettleResult.feeList
        // this.getSaleProducts(this.info.supplyListId);
      });
      this.dialog_show = true
    },
    settlementOrder(){
      this.confirmSettleDialogVisible = true
      this.settle_form = {
        goodsSettlementAmt:this.info.goodsSettlementAmt,
        prepaymentFee:this.info.prepaymentFee,
      }
    },
    sign(){
      this.$confirm('确认结算？', '提示', {type:'warning'}).then(() => {
        signSettlement({settlementId:this.info.id}).then(res => {
          this.$confirm('结算签署确认短信已下发至号码'+res.data.agentPhone+',请前往短信链接地址进行收货确认？', '提示', {showClose:false})
          this.dialog_show = false
          this.getList()
        })
      })
    },
    edit(){
      this.is_edit = true;
    },
    saveEdit(){
      let adjustmentAmt = this.info.adjustmentAmt?this.info.adjustmentAmt:0;

      setSettlementType({settleUp:this.info.settleUp,id:this.info.id,adjustmentAmt:adjustmentAmt}).then(res => {
        this.$message.success('修改成功')
        this.dialog_show = false
        this.getList()
      })
    },
    getWaitSettleAmt1(){
      let sum = 0;
      for(let i = 0; i < this.sale_products.length; i++) {
        sum += this.sale_products[i].waitSettleAmt
      }
        this.dialog_show = false
        this.getList()
    },
    addInfo(){
      this.formData = {}
      this.settle_form = {
        settleUp: 0,
      }
      this.data_fees = [{ financeSubjectId:'' }]
      this.edit_dialog_show = true
      },

    addOtherFee(row){
      this.data_fees.push({ financeSubjectId:'' })
    },
    delOtherFee(row){
      this.data_fees.splice(row,1)
    },
    submitSettlement(){

      this.$refs['form'].validate((valid) => {
        if (valid) {

          let ids = []
          for(let i =0 ;i<this.sale_products.length; i++) {
            ids.push(this.sale_products[i].saleListId)
          }
          let params = {
            cargoOwnerId:this.supply_order_info.cargoOwnerId,
            supplyListId:this.supply_order_info.id,
            agencySellingListId:this.formData.agencySellingListId,
            stallId:this.formData.stallId,
            saleListIds:ids,
            settleUp:this.formData.settleUp,
            adjustmentAmt:this.info.adjustmentAmt,
            settlementAmt:this.getWaitSettleAmt(),
            prepaymentFee:this.getPrepaymentFeeSum(),
            goodsSettlementAmt:this.getProductSum(),
            agentSettleResult:{
              feeList:this.sale_fees,
              saleProductDetailList:this.sale_products
            }
          }
          settlement(params).then(res => {
            this.$message.success('结算成功')
            this.confirmSettleDialogVisible = false
            this.getList()
          })
          // add(this.formData).then(res => {
          //   this.$message.success('结算成功')
          //   this.edit_dialog_show = false
          //   this.getList()
          // })
        }
      })
    },
    onStallChange(e){
      this.getSellingList()
      this.formData = {
        ...this.formData,
        agencySellingListId:''
      }
    },
    onSellingIdChange(e) {
      console.log(e)
      for(let i = 0; i < this.selling_list.length; i++) {
        if(this.selling_list[i].id == e) {
          console.log(this.selling_list[i])
          this.supplyListId = this.selling_list[i].supplyListId
          supplyOrderDetail(this.selling_list[i].supplyListId).then(res => {
            this.supply_order_info = res.data;
          })
        }
      }
      this.getSaleProducts(e)
    },
    getProductSum(){
      let sum = 0;
      for(let i = 0; i < this.sale_products.length; i++) {
        sum += this.sale_products[i].saleAmt
      }
      return sum.toFixed(2);
    },
    getFeeList(){
      let ids = [];
      for(let i = 0; i < this.sale_products.length; i++) {
        ids.push(this.sale_products[i].saleListId)

      }
      let params = {
        bizType:5,is_page:0,bizIds:ids
      }
      feeList(params).then(res => {
        console.log(res)
        this.sale_fees = res.rows;
      })
    },
    getPrepaymentFeeSum(){
      let sum = 0;
      for(let i = 0; i < this.sale_fees.length; i++) {
        sum += this.sale_fees[i].amt
      }
      return sum.toFixed(2);
    },
    getWaitSettleAmt(){
      return this.getProductSum() - this.info.adjustmentAmt - this.getPrepaymentFeeSum()
    },
    settleConfirm(){
      this.$refs['settle_form'].validate((valid) => {
        if (valid){
          let ids = []
          for(let i =0 ;i<this.sale_products.length; i++) {
            ids.push(this.sale_products[i].saleListId)
          }
          let params = {
            cargoOwnerId:this.supply_order_info.cargoOwnerId,
            supplyListId:this.supply_order_info.id,
            agencySellingListId:this.info.agencySellingListId,
            id:this.info.id,
            saleListIds:ids.join(','),
            settleUp:this.settle_form.settleUp,
            adjustmentAmt:this.settle_form.adjustmentAmt,
            settlementAmt:this.settle_form.goodsSettlementAmt - (this.settle_form.adjustmentAmt == undefined?0:this.settle_form.adjustmentAmt) - this.getPrepaymentFeeSum(),
            prepaymentFee:this.getPrepaymentFeeSum(),
            goodsSettlementAmt:this.getProductSum(),
            agentSettleResult:{
              feeList:this.sale_fees,
              saleProductDetailList:this.sale_products
            }
          }
          settlement(params).then(res => {
            this.$message.success('结算成功')
            this.settle_form = {}
            this.dialog_show = false
            this.confirmSettleDialogVisible = false
            this.getList()      })

        }
      })
    },

    getSummaries(param){
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '合计';
          return;
        }else if(index === 2){
          const values = data.map(item => Number(item[column.property]));
          if (!values.every(value => isNaN(value))) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr);
              if (!isNaN(value)) {
                return prev + curr;
              } else {
                return prev;
              }
            }, 0);
          }
        }
      })

      return sums;
    }, getSellSummaries(param){
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = '合计';
          return;
        }else if(index === 6||index === 8||index === 9){
          const values = data.map(item => Number(item[column.property]));
          if (!values.every(value => isNaN(value))) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr);
              if (!isNaN(value)) {
                return prev + curr;
              } else {
                return prev;
              }
            }, 0);
          }
        }
      })

      return sums;
    },
  }
}
</script>

<style scoped>
.section{
  background: #fff;
  padding: 24px;
//padding-bottom: 6px;
  margin: 20px;
  border-radius: 8px;
}
.section-item{
  margin: 10px 0px;
  height: 52px;
}
.section-item-title{
  padding-bottom: 10px;
  font-size: 14px;
}
</style>

<style>

.el-drawer__body{
  background: #F3F4F6;
}
.select-custom-icon .el-input__suffix {
  display: none; /* 隐藏默认的下拉箭头 */
}
.select-custom-icon .el-input__suffix::after {
  content: url('../../../assets/icons/more.png'); /* 替换为您的自定义图标路径 */
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
}
.popper-class{
  display: none;
}

</style>
